<!DOCTYPE html>
<html lang="zh">
<head>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>我的福利</title>
    <link href="css/main.css" type="text/css" rel="stylesheet" />
</head>
<body id="wdfl">
<div  class="container">
    <ul class="gnd_tabList clearfix">
        <li class="detail_active"><span>全部</span></li>
        <li><span>已领取</span></li>
        <li><span>未领取</span></li>
    </ul>
    <ul class="wdfl_detail">
        <li class="shop_detail clearfix" >
             <div class="sd_left fl">
                 <img src="tmp/bbbb.png"/>
             </div>
             <div class="sd_right fl clearfix">
                 <p class="shop_title">TCL70英寸 窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机</p>
                 <p class="shop_source">AR寻宝获得</p>
                 <div class="btn_lingqu fr">领取</div>
             </div>
        </li>
        <li class="shop_detail clearfix" >
            <div class="sd_left fl">
                <img src="tmp/bbbb.png"/>
            </div>
            <div class="sd_right fl clearfix">
                <p class="shop_title">TCL70英寸 窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机窄边框蓝光LED液晶电视机</p>
                <p class="shop_source">AR寻宝获得</p>
                <div class="btn_lingqu btn_yilingqu fr">已领取</div>
            </div>
        </li>

    </ul>
</div>
<script src="js/rem.js"></script>
<script src="js/jquery.js"></script>
<script>
    $(function(){
        $(".gnd_tabList li").click(function(){
            $(".gnd_tabList li").removeClass("detail_active");
            $(this).addClass("detail_active");
        });
    })
</script>
</body>
</html>